<template>
  <!-- 英雄联盟自动获取授权 -->
  <el-dialog :title="'扫码授权'" :visible.sync="dialogVisible" :close-on-click-modal="false" width="300px" append-to-body @close="close">
    <div class="form-box">
      <div class="demo-ruleForm">
        <img :src="qrCode" alt="" style="width: 200px;height: 200px;">
        <div class="center">
          {{ msg == '二维码认证中' ? '已扫码，等待授权' : '请扫描二维码进行授权' }}
        </div>
      </div>
    </div>
  </el-dialog>
</template>

<script>
import autoApi from "@/api/autoProduction/information.js"
export default {
  name: "addFina",
  data() {
    return {
      dialogVisible: false,
      loading: false,
      msg: '',
      qrCode: '',
      uuid: '',
      timer: null,
      type:'LOL'
    };
  },
  created() {

  },
  beforeDestroy() {
    window.clearInterval(this.timer)
  },
  methods: {
    // 打开弹窗
    open(type) {
      this.type = type
      this.dialogVisible = true
      this.getQrCode()
    },
    close(){
      window.clearInterval(this.timer)
    },
    getQrCode() {
      autoApi.getLOLQRcode().then(res => {
        if (res.code == 200) {
          this.qrCode = res.data.base64Img
          this.uuid = res.data.uuid
          this.getTokenInterval()
        }
      })
    },
    getToken() {
      let obj = {
        uuid: this.uuid,
        type: this.type
      }
      autoApi.postToken(obj).then(res => {
        this.msg = res.msg
        if(res.msg=='操作成功'){
          let resData = {
            type:this.type,
            ...res.data
          }
          this.$emit('success',resData)
          window.clearInterval(this.timer)
          this.timer = null
          this.dialogVisible = false
        }
      }).catch(err => {
        if (err.code == 500) {
          this.getQrCode()
        }
      })
    },
    getTokenInterval() {
      window.clearInterval(this.timer)
      this.timer = window.setInterval(() => {
        this.getToken()
      }, 5000)
    }
  }
};
</script>
<style scoped lang="css">
.demo-ruleForm {
  text-align: center;
}
</style>
